<template>
	<div>
		<van-picker
		  title="标题"
		  show-toolbar
		  :columns="columns"
		  @confirm="onConfirm"
		  @cancel="onCancel"
		  @change="onChange"
		/>
	</div>
</template>

<script>
	import '/src/assets/style/picker/index.less';
	import { Toast } from 'vant';
	
	export default {
	  data() {
	    return {
	      columns: [
				{
				  text: '浙江',
				  children: [
					{
					  text: '杭州',
					  children: [{ text: '西湖区' }, { text: '余杭区' }],
					},
					{
					  text: '温州',
					  children: [{ text: '鹿城区' }, { text: '瓯海区' }],
					},
				  ],
				},
				{
				  text: '福建',
				  children: [
					{
					  text: '福州',
					  children: [{ text: '鼓楼区' }, { text: '台江区' }],
					},
					{
					  text: '厦门',
					  children: [{ text: '思明区' }, { text: '海沧区' }],
					},
				  ],
				},
			  ],
	    };
	  },
	  methods: {
	    onConfirm(value, index) {
	      Toast(`当前值：${value}, 当前索引：${index}`);
	    },
	    onChange(picker, value, index) {
	      Toast(`当前值：${value}, 当前索引：${index}`);
	    },
	    onCancel() {
	      Toast('取消');
	    },
	  },
	};
</script>

<style>
</style>
